<template>
  <div class="oneToOneDonation">
    <div class="head">
      <i class="iconfont head-icon" @click="comeBack">&#xe689;</i>
      希望工程一对一捐助

      <span class="shaixuan" @click="goScreen"><i class="iconfont">&#xe64f;</i> 筛选</span>
    </div>
    <div class="content">
      <div class="content_title_box">
        <div class="content_title">捐助项目</div>
        <div class="content_text" v-html="eventL.project_name"></div>
      </div>
      <div class="content_title_box">
        <div class="content_title">捐助金额</div>
        <div class="content_text content_money">{{eventL.needMoney}}元</div>
      </div>
      <div class="content_title_box">
        <div class="content_title">发起机构</div>
        <div class="content_text" v-html="eventL.organization"></div>
      </div>
      <div class="content_title_box">
        <div class="content_title_oth">捐助对象</div>
        <div class="content_pro">
          <div class="content_pro_top">
            <div class="content_pro_top_avatar">
              <img v-if="eventL.photo != ''" :src="imageUrl.imageUrl + eventL.photo" alt="">
              <img v-else-if="eventL.sex == '男'" src="../../images/man.png" alt="">
              <img v-else="" src="../../images/woman.png" alt="">
            </div>
            <!--<div class="content_pro_top_shaixua" @click="goScreen">-->
              <!--<i class="iconfont">&#xe64f;</i> 筛选-->
            <!--</div>-->
            <div class="content_pro_top_text">
              <p class="content_pro_top_text_first" v-html="eventL.name"></p>
              <p v-if="event_id != 'eb783144cf9e47f999708a67d48b576d'">{{eventL.sex}} {{eventL.age}}岁</p>
              <p>编号： {{eventL.studentid}}</p>
              <p v-if="event_id == 'eb783144cf9e47f999708a67d48b576d'">高考成绩： {{eventL.scoreGk}}</p>
              <p v-if="event_id == 'eb783144cf9e47f999708a67d48b576d'">录取院校： {{eventL.school}}</p>
              <p>{{eventL.city}} {{eventL.country}}</p>
            </div>
          </div>
           <div class="content_pro_bottom" v-if="event_id == 'eb783144cf9e47f999708a67d48b576d'">
              <div class="content_pro_bottom_title">
                申请理由
              </div>
              <div class="content_pro_bottom_text">
                <group>
                  <cell
                    :title="celltitle"
                    is-link
                    :border-intent="false"
                    :arrow-direction="showContent ? 'up' : 'down'"
                    @click.native="showContent = !showContent"></cell>
                  <p class="slide" :class="showContent?'animate':''" v-html="eventL.reason"></p>
                </group>
              </div>
           </div>
          <div class="content_pro_bottom" v-if="event_id != 'eb783144cf9e47f999708a67d48b576d'">
            <div class="content_pro_bottom_title">
              个人情况
            </div>
            <div class="content_pro_bottom_text">
              <group>
                <cell
                  :title="celltitle"
                  is-link
                  :border-intent="false"
                  :arrow-direction="showContent ? 'up' : 'down'"
                  @click.native="showContent = !showContent"></cell>
                <p class="slide" :class="showContent?'animate':''" v-html="eventL.pecuniaryCondition"></p>
              </group>
            </div>
          </div>
          <div class="content_pro_bottom" v-if="event_id != 'eb783144cf9e47f999708a67d48b576d'">
            <div class="content_pro_bottom_title">
              在校情况
            </div>
            <div class="content_pro_bottom_text">
              <group>
                <cell
                  :title="celltitle"
                  is-link
                  :border-intent="false"
                  :arrow-direction="showContentT ? 'up' : 'down'"
                  @click.native="showContentT = !showContentT"></cell>
                <p class="slide" :class="showContentT?'animate':''" v-html="eventL.schoolPerform"></p>
              </group>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!--<div class="imageBox" id="cnt">-->
    <!--<div class="imageBg">-->
    <!--<img :src="imageUrl.imageUrl + eventL.photo" alt="">-->
    <!--</div>-->
    <!--<div class="imageAdd">-->
    <!--<img src="../../images/onetooneadd.png" alt="">-->
    <!--</div>-->
    <!--<div v-show="student_id == ''" class="rightBtn" @click="rightBtn">-->
    <!--<i class="iconfont">&#xe64c;</i>-->
    <!--</div>-->
    <!--<div v-show="student_id == ''" class="leftBtn" @click="leftBtn">-->
    <!--<i class="iconfont">&#xe657;</i>-->
    <!--</div>-->
    <!--</div>-->
    <!--<div class="eventTitle">-->
    <!--<p><span v-html="eventL.name"></span> <span>{{eventL.sex}}</span> <span>{{eventL.age}}岁</span> <span>{{eventL.area}}</span></p>-->
    <!--</div>-->
    <!--<div class="mechanism">-->
    <!--<p>发起机构： <span v-html="eventL.organization"></span></p>-->
    <!--</div>-->
    <!--<div class="targetMoney">-->
    <!--<div class="targetB">-->
    <!--目标 <span>{{eventL.needMoney}}</span> 元-->
    <!--</div>-->
    <!--</div>-->
    <!--<div class="content" v-html="eventL.pecuniaryCondition">-->
    <!--</div>-->
    <div class="footerBtns">
      <!--<div class="lastBtn" @click="lastEven">上一个</div>-->
      <div class="wantDonationBtn" @click="goPayment"><i class="iconfont head-icon"
                                                         style="font-size: 18px;">&#xe625;</i>
        我要捐助
      </div>
      <!--<div class="nextBtn" @click="nextEven">下一个</div>-->
    </div>
    <div class="popup">
      <div>
        <popup v-model="show" :hide-on-blur=true>
          <div class="popup2">
            <group v-show="ifShowtt" style="margin-top: 20px">
              <cell title="其他信息">
              </cell>
              <p class="otherTi">*如填写，您的捐赠信息将纳入个人信用体系</p>
            </group>
            <group title="" style="margin-top: 10px" class="allGroup">
              <x-input class="allInput" v-model="name" title="" placeholder="您的姓名（真名或化名）"></x-input>
            </group>
            <group title="" class="allGroup">
              <x-input type="number" class="allInput" title="" ref="mobile" v-model="mobile" is-type="china-mobile"
                       placeholder="您的电话"></x-input>
            </group>
            <group title="" class="allGroup">
              <x-input class="allInput" title="" ref="IDNum" v-model="IDNum" :is-type="isID"
                       placeholder="您的身份证号码（非必填）"></x-input>
            </group>
            <group title="" class="allGroup">
              <x-input class="allInput" title="" ref="IDNum" v-model="address"
                       placeholder="您的联系地址（如需结对卡，请填写地址）"></x-input>
            </group>
            <group style="margin-top: 20px">
              <cell title="我要留言（非必填）"></cell>
            </group>
            <group title="" class="allGroup">
              <x-textarea class="allTextarea" v-model="liuyan" placeholder="给他们一些鼓励的话吧" :show-counter="false" :rows="1"
                          autosize></x-textarea>
            </group>
            <x-button type="primary" @click.native="primaryd">立刻捐款</x-button>
            <x-button type="primary" @click.native="payXX">线下支付</x-button>
            <div>
              <input type="checkbox" value="" v-model="checkOKs" @change="checkOks" style="margin-bottom: 2px">
              <span style="color: #999999;font-size: 14px">同意并接受</span>
              <router-link :to="{path: '/aboutqqc', query: {witchOne: 'tiaokuan'}}"><em
                style="font-size: 14px">《亲青筹用户协议》</em></router-link>
            </div>
            <!--适应苹果手机-->
            <div style="width: 100%;height: 20px"></div>
          </div>
           <div v-transfer-dom>
                      <confirm v-model="showConfirm"
                      title=""
                      show-cancel-button="false"
                      confirm-text=""
                      cancel-text=""
                      @on-cancel="onCancel"
                      @on-confirm="onConfirm"
                      @on-show="onShow"
                      @on-hide="onHide">
                        <p style="text-align:center;font-size:14px;">开户行:工行武林支行 <br/>户名:浙江省青少年发展基金会 <br/>帐号:1202021209014404811 <br/>请您在汇款时尽可能的详细填写捐方名称及捐助项目，并详细注明受助学生姓名，如汇款人和捐赠人不一致，请备注捐赠人名字，以便 我们及时核对 ，回寄收据。</p>
                      </confirm>
              </div>
        </popup>
      </div>
    </div>
  </div>

</template>
<style lang="scss" src='./oneToOneDonation.scss'></style>
<script src="./oneToOneDonation.js"></script>
